{extend name="common/common" /}

{block name="style"}

{/block}

{block name="content"}
<el-card class="box-card">
	<div slot="header">
		<span class="span-primary"><i class="fa fa-list"></i></span>
		附件列表
		{if authCheck('attachment/uploadattach') }
		<el-button class="header-btn" size="small" type="primary" @click="uploadAttach" plain>上传附件</el-button>
		{/if}
		{if authCheck('attachment/setattachstatus') }
		<el-button class="header-btn" size="small" type="warning" @click="setStatus" plain>翻转状态</el-button>
		{/if}
		{if authCheck('attachment/delattach') }
		<el-button class="header-btn" size="small" type="danger" @click="delAttach" plain>删除附件</el-button>
		{/if}
	</div>
	<div id="table-box">
		<el-table :data="tableData" stripe="true" border @selection-change="getIds">
			<el-table-column
				type="selection"
				width="50">
			</el-table-column>
			<el-table-column prop="id" label="ID" width="50"></el-table-column>
			<el-table-column prop="name" label="附件名称" width="160"></el-table-column>
			<el-table-column prop="path" label="附件链接"></el-table-column>
			<el-table-column prop="ext" label="附件类型" width="100"></el-table-column>
			<el-table-column prop="size" label="附件大小(Mb)" width="120"></el-table-column>
			<el-table-column prop="download" label="下载次数" width="100"></el-table-column>
			<el-table-column
				prop="status"
				label="状态"
				width="100">
				<template slot-scope="scope">
					<el-tag
					:type="scope.row.status == '1' ? 'primary' : 'danger'"
					disable-transitions>{{scope.row.status_name}}</el-tag>
				</template>
			</el-table-column>
			<el-table-column prop="create_time" label="上传时间"></el-table-column>
		</el-table>
		<div class="table-page">
			<el-pagination
				@size-change="pageSizeChange"
				@current-change="curPageChange"
				:current-page="pageNumber"
				:page-sizes="[10, 20, 50, 75]"
				:page-size="pageSize"
				layout="total, sizes, prev, pager, next, jumper"
				:total="tableTotal">
			</el-pagination>
		</div>
	</div>
</el-card>
{/block}

{block name="script"}
<script type="text/javascript">
var main = new Vue({
	el:"#main",
	data() {
		return {
			loading:false,
			tableData:'',
			pageSize:10,
			pageNumber:1,
			tableTotal:0,
			tagFilters:[
				{ text: '启用', value: '1' },
				{ text: '禁用', value: '0' }
			],
			Ids:[]
		}
	},
	mounted:function(){
		this.getTable();
	},
	methods:{
		getTable() {
			this.loading=true;
			$.post('./index',{
				'pageSize':this.pageSize,
				'pageNumber':this.pageNumber,
			},function(res){
				main.loading=false;
				if(res.code == 1){
					main.$message({
			          message: res.msg,
			          type: 'success'
			        });
					main.tableData = res.data.rows;
					main.tableTotal = res.data.total;
				}else{
					main.$notify.error({
						title: '失败',
						message: res.msg,
					});
				}
			})
		},
		pageSizeChange(val) {
			this.pageSize = val;
			this.getTable();
		},
		curPageChange(val) {
			this.pageNumber = val;
			this.getTable();
		},
		getIds(val){
			this.Ids = val;
		},
		setStatus() {
			var ids = [];
			for(var i=0;i<this.Ids.length;i++){
				ids[i] = this.Ids[i].id;
			}
			if(ids.length == 0){
				this.$notify.error({
					title:"错误",
					message:"请选择要操作的数据"
				});
				return false;
			}
			$.post('./setAttachStatus',{
				'param':ids
			},function(res){
				if(res.code == '1'){
					main.$notify({
						title:"成功",
						type:"success",
						message:res.msg
					});
					main.getTable();
				}else{
					main.$notify.error({
						title:"错误",
						message:res.msg
					})
				}
			})
		},
		uploadAttach() {
			uploadAlert.is_show = true;
			uploadAlert.limit = 5;
		},
		upSuccess(){
			this.getTable();
		},
		delAttach() {
			var ids = [];
			for(var i=0;i<this.Ids.length;i++){
				ids[i] = this.Ids[i].id;
			}
			if(ids.length == 0){
				this.$notify.error({
					title:"错误",
					message:"请选择要操作的数据"
				});
				return false;
			}
			this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				$.post('./delAttach',{
					'param':ids
				},function(res){
					if(res.code == '1'){
						main.$notify({
							title:"成功",
							type:"success",
							message:res.msg
						});
						main.getTable();
					}else{
						main.$notify.error({
							title:"错误",
							message:res.msg
						})
					}
				})
			}).catch(() => {
				this.$notify.info({
					title: '消息',
					message: '已取消删除'
				});
			});
		}
	}
})
</script>
{/block}
